<template>
	<view v-if="pageShow">
		<view class="mainpadding" style="padding-bottom: 160rpx;">
			<view class="mainpadding ffffff radius">
				<view class="titletext hei_text bold">{{dataAll.info.name}}</view>
				<view class=" hui_text main_size bold margin_top">{{dataAll.info.description}}</view>
				<view class="flexleft margin_top">
					<view class="viplable margin_right" v-show="dataAll.info.is_vip">vip</view>
					<view class="bianhao">编号：{{dataAll.info.id}}</view>
				</view>
				<view class="margin_top titletext hong_text bold">￥{{dataAll.info.price}}</view>
			</view>
			<view class="mainpadding_top ffffff radius">
				<view class="flexbetween pdl" v-for="(item,index) in dataAll.info.files_data" :key="index">
					<view class="flexleft">
						<image src="@/static/image/system/zl.png" mode="" class="zl"></image>
						<view class="main_size bold hei_text margin_left">{{item.intro}}</view>
					</view>
					<view class="flexright">
						<u-icon name="lock" color="#999" size="20" v-if="!dataAll.info.is_free"></u-icon>
						<u-icon name="lock-open" color="#999" size="20" v-if="dataAll.info.is_free"></u-icon>
						<view class="listbtnlan margin_left" @click="downloadFile(item)">点击查看</view>
					</view>
				</view>
			</view>
			<view class="mainpadding_top ffffff radius flexbetween">
				<view class="flexleft">
					<image :src="dataAll.info.teacher.avatar" class="headimg margin_right" mode=""></image>
					<view class="hei_text titletext bold">{{dataAll.info.teacher.username}}</view>
				</view>
				<view class="listbtnlan" @click="jumpurl('/pages_index/personalHomepage?id=',dataAll.info.teacher.id)">
					进入主页</view>
			</view>
			<view class="mainpadding_top ffffff radius" v-if="dataAll.comments.length">
				<view class="flexbetween" @click="jumpurl('/pages_index/allevaluate?id=',listid)">
					<view class="hei_text main_size bold">评价</view>
					<view class="xiaolan flexright">
						<view class="xiaolan margin_right1">查看全部</view>
						<u-icon name="arrow-right" color="#3478f5" size="12"></u-icon>
					</view>
				</view>
				<view class="margin_top" v-for="(item,index) in dataAll.comments" :key="item.id" v-if="index==0">
					<view class="flexbetween">
						<view class="flexleft">
							<image :src="item.avatar" mode="" class="listheadplimg"></image>
							<view class="xiaohei margin_left1">{{item.nickname}}</view>
						</view>
						<view class="xiaohui">{{item.createtime_text}}</view>
					</view>
					<view class="hui_text bold main_size margin_top">{{item.content}}</view>
					<view class="flexleft">
						<view class="itemimgBox flexcenter margin_top" v-for="ite in item.images_arr" :key="ite">
							<image class="listleftimg radius" :src="ite" mode=""></image>
						</view>
					</view>
				</view>
			</view>
			<view class="mainpadding_top ffffff radius">
				<view class="hei_text main_size bold flexcenter">详情</view>
				<u-parse :content="dataAll.info.content"></u-parse>
			</view>
			<view class="posibottom mainpadding flexbetween ffffff">
				<view class="flexleft">
					<view class="flexcolumn margin_right"
						@click="jumpurl('/pages_index/personalHomepage?id=',dataAll.info.teacher.id)">
						<u-icon name="home" color="#999" size="20"></u-icon>
						<view class="xiaohui">主页</view>
					</view>
					<view class="flexcolumn" v-if="!dataAll.info.is_collect" @click="collect">
						<u-icon name="star" color="#999" size="20"></u-icon>
						<view class="xiaohui">收藏</view>
					</view>
					<view class="flexcolumn" v-if="dataAll.info.is_collect" @click="collect">
						<u-icon name="star-fill" color="#3478f5" size="20"></u-icon>
						<view class="xiaohui">已收藏</view>
					</view>
				</view>
				<view class="submitbtn" style="width: 300rpx;" v-if="!dataAll.info.is_free" @click="submit">立即购买</view>
			</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")

	export default {
		data() {
			return {
				listid: "",
				dataAll: {},
				pageShow: false,
			}
		},
		onLoad(options) {
			this.listid = options.id
			this.getDetail()
		},
		methods: {
			submit() {
				httpRequest.request('/api/lesson/create_order', 'POST', {
					education_lesson_id: this.listid
				}, false, false, true).then(res => {
					if (res.code == 1) {
						let data = {
							pay_price: res.data.pay_price,
							order_id: res.data.order_id
						}
						uni.redirectTo({
							url: '/pages_index/kechengddzf?msg=' + encodeURIComponent(JSON
								.stringify(data))
						})
					} else {
						httpRequest.toast(res.msg);
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			downloadFile(item) { //下载文件
			let _this = this
				if (!this.dataAll.info.is_free) {
					httpRequest.toast("请先购买！")
					return false
				}
				uni.showLoading({
					title: '请稍后'
				});
				//下载文件
				uni.downloadFile({
					url: item.file, //下载地址接口返回
					success: (data) => {
						if (data.statusCode === 200) {
							//隐藏加载框
							uni.hideLoading();
							//文件保存到本地
							uni.saveFile({
								tempFilePath: data.tempFilePath, //临时路径
								success: function(res) {
									uni.showToast({
										icon: 'success',
										mask: true,
										// title: '文件已保存：' + res.savedFilePath, //保存路径
										title: '下载成功',
										duration: 2000,
									});
									//自动打开文档查看
									_this.addlog(100)
									setTimeout(() => {
										var filePath = res.savedFilePath;
										uni.openDocument({ //新开页面打开文档，支持格式：doc, xls, ppt, pdf, docx, xlsx, pptx。
											filePath: filePath,
											showMenu: true,
											success: function(res) {}
										});
									}, 2000)
								}
							});
						}
					},
					fail: (err) => {
						console.log(err);
						uni.showToast({
							icon: 'none',
							mask: true,
							title: '文件下载失败',
						});
					},
				});
			},
			addlog(val){//添加课程学习记录
				httpRequest.request('/api/lesson/addlog', 'POST', {
					id: this.listid,
					view_per:val
				}, false, false, true).then(res => {
				})
			},
			getDetail() {
				httpRequest.request('/api/lesson/getdetail', 'GET', {
					id: this.listid
				}, false, false, true).then(res => {
					if (res.code == 1) {
						this.dataAll = res.data
						this.pageShow = true
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			collect() { //收藏
				httpRequest.request('/api/lesson/collects', 'GET', {
					id: this.listid
				}, false, false, true).then(res => {
					httpRequest.toast(res.msg)
					if (res.code == 1) {
						this.dataAll.info.is_collect = this.dataAll.info.is_collect ? false : true
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			jumpurl(url, id) {
				uni.navigateTo({
					url: url + id
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.zl {
		width: 56rpx;
		height: 56rpx;
	}
</style>